// 导入Manager组件
import Manager, { type TableColumnConfig ,type ManageApiConfig} from "../../component/Manager/index.tsx";
import dayjs from "dayjs";
import type { DetailFieldConfig, FormItemConfigs } from "../../global.ts";
// 用户管理页面组件
export default function () {
  // 用户管理API配置
  const apiConfig: ManageApiConfig = {
    search: "/v1/admin/config",
    edit: "/v1/admin/config",
    add: "/v1/admin/config",
    delete: "/v1/admin/config",
  };

  // 用户管理表格列配置
  const tableColumnConfig: TableColumnConfig[] = [
    {
      title: "序号",
      dataIndex: "_index",
      key: "_index",
      fixed: "left",
      width: 80,
    },

    {
      title: "配置名称",
      dataIndex: "name",
      key: "name",
    },
    {
      title: "保密级别",
      dataIndex: "level",
      key: "level",
      render: (text, record) => {
        // options:[{label:'前台',value:0},{label:'后台',value:1}]
        return text ? "后台" : "前台";
      },
    },
    {
      title: "配置标识",
      dataIndex: "key",
      key: "key",
    },
    {
      title: "配置值",
      dataIndex: "value",
      key: "value",
      width: 300,
      ellipsis: true,
    },
    {
      title: "更新时间",
      dataIndex: "updated_at",
      key: "updated_at",
      render: (text) => {
        // 获取当前日期
        const now = dayjs(text);
        // console.log(now.format('YYYY-MM-DD'));
        return now.format("YYYY-MM-DD HH:mm:ss");
      },
    },
    {
      title: "操作",
      dataIndex: "operate",
      key: "operate",
    },
  ];

  // 用户管理搜索表单字段配置
  const searchFormFieldConfig: FormItemConfigs[] = [
    {
      label: "关键字",
      name: "keyword",
      type: "input",
    },
  ];

  // 用户管理新增表单字段配置
  const addFormFieldConfig: FormItemConfigs[] = [
    {
      label: "配置名称",
      name: "name",
      type: "input",
    },
    {
      label: "标识",
      name: "key",
      type: "input",
    },
    {
      label: "保密级别",
      name: "level",
      type: "select",
      options: [
        { label: "前台", value: 0 },
        { label: "后台", value: 1 },
      ],
    },
    {
      label: "配置值",
      name: "value",
      type: "textarea",
    },
  ];

  // 用户管理编辑表单字段配置
  const editFormFieldConfig: FormItemConfigs[] = [
    {
      label: "配置ID",
      name: "id",
      type: "hidden",
    },
    ...addFormFieldConfig,
  ];

  // 用户管理详情字段配置
  const detailFieldConfig: DetailFieldConfig[] = [
    {
      title: "序号",
      dataIndex: "_index",
    },
    {
      title: '配置ID',
      dataIndex: 'id',
    },
    {
      title: '配置名称',
      dataIndex: 'name',
    },
    {
      title: '配置标识',
      dataIndex: 'key',
    },
    {
      title: '配置值',
      dataIndex: 'value',
      span: 2,
    },
    {
      title: '保密级别',
      dataIndex: 'level',
    },
    {
      title: "创建时间",
      dataIndex: "created_at",
      render: (text, record) => {
        // 获取当前日期
        const now = dayjs(text);
        // console.log(now.format('YYYY-MM-DD'));
        return now.format("YYYY-MM-DD HH:mm:ss");
      },
    },
    {
      title: "更新时间",
      dataIndex: "updated_at",
      render: (text, record) => {
        // 获取当前日期
        const now = dayjs(text);
        // console.log(now.format('YYYY-MM-DD'));
        return now.format("YYYY-MM-DD HH:mm:ss");
      },
    },
  ] as DetailFieldConfig[];

  // 渲染Manager组件
  return (
    <>
      <Manager
        apiConfig={apiConfig}
        tableColumnConfig={tableColumnConfig}
        searchFormFieldConfig={searchFormFieldConfig}
        editFormFieldConfig={editFormFieldConfig as any}
        addFormFieldConfig={addFormFieldConfig}
        detailFieldConfig={detailFieldConfig}
        enableAdd
        enableEdit
        enableDelete
        defaultViewType="list"
      />
    </>
  );
}
